<style scoped>
  @import "./styleOflogin.css";
</style>
<template>
  <div style="min-height:730px; height:100px">
    <div id="particles-js"></div>
  </div>
</template>

<script>
  import particlesJs from "particles.js";
  import particlesConfig from "./particles.json";
  export default {
    name :'bcg',
    data() {
      return {};
    },
    mounted() {
    	particlesJS("particles-js", particlesConfig);
        // particlesJs("particles-js",   particlesConfig);
    },
  };
  </script>

<!--   
这是一个 particles.js 的配置文件，用于设置粒子效果的各种参数，以下是对其详细的讲解：
 
particles 部分
 
number：设置粒子的数量和密度。
 value ：粒子的数量，这里设置为40。
 density ：密度相关设置。
 enable ：是否启用密度计算，设为 true 。
 value_area ：计算密度的区域面积，值为800。
color：设置粒子的颜色，这里粒子颜色为白色（ #ffffff ）。
shape：定义粒子的形状。
 type ：粒子的基本形状，这里是圆形（ circle ），还可以是 square （方形）、 polygon （多边形）等。
 stroke ：粒子边框的设置。
 width ：边框宽度为0，即没有边框。
 color ：边框颜色为黑色（ #000000 ）。
 polygon ：当 type 为 polygon 时生效，设置多边形的边数，这里为5边形。
 image ：可以设置粒子为指定的图片，这里设置为 img/github.svg ，图片宽度为100，高度为100。
opacity：设置粒子的不透明度。
 value ：粒子的不透明度为0.7。
 random ：是否随机不透明度，设为 false 。
 anim ：不透明度的动画设置。
 enable ：是否启用动画，设为 false 。
 speed ：动画速度。
 opacity_min ：最小不透明度为0.1。
 sync ：是否同步动画，设为 false 。
size：设置粒子的大小。
 value ：粒子的基础大小为3。
 random ：是否随机大小，设为 true 。
 anim ：粒子大小的动画设置。
 enable ：是否启用动画，设为 false 。
 speed ：动画速度。
 size_min ：最小大小为0.1。
 sync ：是否同步动画，设为 false 。
line_linked：设置粒子之间的连线。
 enable ：是否启用连线，设为 true 。
 distance ：粒子之间能连线的最大距离为150。
 color ：连线颜色为白色（ #ffffff ）。
 opacity ：连线的不透明度为0.6。
 width ：连线的宽度为1。
move：设置粒子的移动属性。
 enable ：是否启用粒子移动，设为 true 。
 speed ：粒子的移动速度为6。
 direction ：粒子移动方向， [none](coco://sendMessage?ext=%7B%22s%24wiki_link%22%3A%22https%3A%2F%2Fm.baike.com%2Fwikiid%2F1128424129462345307%22%7D&msg=none) 表示无特定方向。
 random ：是否随机移动，设为 false 。
 straight ：是否直线移动，设为 false 。
 out_mode ：粒子移出边界的模式， out 表示移出。
 bounce ：粒子是否反弹，设为 false 。
 attract ：粒子吸引相关设置。
 enable ：是否启用吸引效果，设为 false 。
 rotateX 和 rotateY ：用于吸引效果的旋转参数。
 
interactivity 部分
 
detect_on：设置交互检测的区域，这里为 canvas ，表示在画布上检测交互。
events：设置交互事件。
 onhover ：鼠标悬停时的交互设置。
 enable ：是否启用鼠标悬停交互，设为 true 。
 mode ：交互模式为 grab ，即鼠标悬停时可以“抓住”粒子。
 onclick ：鼠标点击时的交互设置。
 enable ：是否启用鼠标点击交互，设为 true 。
 mode ：交互模式为 push ，即点击时会添加新的粒子。
 resize ：是否在窗口大小改变时重新计算粒子效果，设为 true 。
modes：设置不同交互模式的具体参数。
 grab ：鼠标悬停时的 grab 模式设置。
 distance ：鼠标能“抓住”粒子的最大距离为200。
 line_linked ：当鼠标“抓住”粒子时，连线的不透明度设为1。
 bubble ： bubble 模式设置（未详细触发条件，一般可能与特定操作相关）。
 distance ：相关距离为400。
 size ：气泡大小为40。
 duration ：持续时间为2。
 opacity ：不透明度为8。
 speed ：速度为3。
 repulse ： repulse 模式设置（可能是粒子相互排斥效果）。
 distance ：排斥距离为200。
 duration ：持续时间为0.4。
 push ： push 模式设置（鼠标点击添加粒子），每次点击添加4个粒子。
 remove ： remove 模式设置（可能是某种条件下移除粒子），每次移除2个粒子。
 
retina_detect 部分
 
 retina_detect ：是否检测视网膜屏幕，设为 false ，即不进行视网膜屏幕检测。 -->